<template name="appCreateAddress">

<div class="small ui modal" id="saveItModal">
  <div class="header">Save your wallet file now!</div>
  <div class="content">
    <div class="ui warning icon message">
      <i class="warning icon"></i>
      <div class="content">
        <p>You must save the details on this page or risk losing funds sent or allocated to this wallet address.</p>
      </div>
    </div>
  </div>
  <div class="actions">
    <div class="ui approve button red">I understand, I will save the details on this page!</div>
    <div class="ui cancel red button plain">Cancel</div>
  </div>
</div>

<div class="small ui modal" id="saveItEducationModal">
  <div class="header">Please read about wallet basics!</div>
  <div class="content">
    <div class="ui warning icon message">
      <i class="warning icon"></i>
      <div class="content">
        <p>
          Please read our <a href="https://docs.theqrl.org/wallet/basics/" target="_blank">wallet basics</a> documentation before proceeding to create your wallet.<br /><br />
          When you've done this, come back and re-create your QRL wallet.
        </p>
      </div>
    </div>
  </div>
  <div class="actions">
    <div class="ui approve green button">Okay</div>
  </div>
</div>

<div class="small ui modal" id="insecureModal">
  <div class="header">Whoa there buddy!!</div>
  <div class="content">
    <div class="ui warning icon message">
      <i class="warning icon"></i>
      <div class="content">
        <div class="header">
          Security Notice
        </div>
        <p>You have opted to save an insecure wallet file. This means your Mnemonic Phrase and Hexseed will be saved in plain text. If anyone ever gets this file, they will have full access to all Quanta and Tokens associated with this wallet. It is strongly recommended to save a secure wallet file unless you are absolutely sure you know what you're doing.</p>
      </div>
    </div>
  </div>
  <div class="actions">
    <div class="ui approve button red">I understand the risks, save the insecure file!</div>
    <div class="ui cancel red button plain">Cancel</div>
  </div>
</div>

<h4 id="createWallet" class="ui pageHeader header">
  <i class="tiny plus icon"></i>
  <div class="content">
    Your new wallet details
  </div>
</h4>

<div class="ui segment pageSegment">
  <div class="ui warning icon message">
    <i class="warning icon"></i>
    <div class="content">
      <div class="header">
        Security Notice
      </div>
      <p>The details shown below are private, and should never be shared with anyone! You should write these details down, and store them in a secure location to ensure no losses are incurred.</p>
    </div>
  </div>

  <div class="ui stackable two column grid">
    <div class="column fourteen wide">
      <h4 class="ui header">QRL Address</h4>
      <div class="ui inverted segment">
        <p id="newAddress" style="word-wrap: break-word;">{{# if bech32}}{{newAddress.addressB32}}{{else}}{{newAddress.address}}{{/if}}</p>
      </div>
    </div>

    <div class="column two wide right aligned">
      {{> QRCode text=QRText size="88px"}}
    </div>
  </div>

  <h4 class="ui header">Mnemonic Phrase</h4>
  <div class="ui inverted segment">
    <p id="newAddressMnemonic">{{newAddress.mnemonic}}</p>
  </div>

  <h4 class="ui header">Hexseed</h4>
  <div class="ui inverted segment">
    <p style="word-wrap: break-word;">{{newAddress.hexseed}}</p>
  </div>

  <div class="ui stackable three column grid">
    <div class="column center aligned">
      <button id="openWalletButton" class="ui huge red button red">Open Wallet</button>
    </div>
    <div class="column center aligned">
      <button id="saveUnencrypted" class="ui huge green button plain">Save Unencrypted Wallet File</button>
    </div>
    <div class="column center aligned">
      <button id="saveEncrypted" class="ui huge green button plain">Save Secure Wallet File</button>
    </div>
  </div>
</div>

</template>